import './App.css';
import Cart from './cz/car/Car';
import Swiper1 from './component/swiper/Swiper';
import Fl from './cz/fl/Fl';
import INdex from './cz/index/INdex';
import Home from './cz/home/Home.jsx'
import Detail from './cz/detail/Detail.jsx'
import Error from './cz/error/Error.jsx'
import './list.css'
import { Route } from 'react-router-dom/cjs/react-router-dom.min';
import { NavLink, Switch, Redirect, useLocation } from 'react-router-dom/cjs/react-router-dom';
import './static/iconfont.css'
import Search from './cz/search/Search';
import SearchList from './cz/search/SearchList';
function App() {
  const location = useLocation()
  let allPath = [ '/index', '/fl', '/car', '/home', '/fl/fldetail/150', '/fl/fldetail/415' ,'/fl/fldetail/157' ]
  // console.log(Route);
  return (
    <div className="App">
      <Switch>
        <Route path='/index' component={INdex}></Route>
        <Route path='/fl' component={Fl}></Route>
        <Route path='/car' component={Cart}></Route>
        <Route path='/home' component={Home}></Route>
        <Route path='/search' component={Search}></Route>
        <Route path='/searchlist/:name' component={SearchList}></Route>
        {/* <Route path='/fl/fl1' component={Fl1}></Route>
        <Route path='/fl/fl2' component={Fl2}></Route>
        <Route path='/fl/fl3' component={Fl3}></Route> */}
        <Route path='/detail/:id' component={Detail}></Route>
        <Redirect from='/' to='/index' exact></Redirect>
        <Route component={Error}></Route>
      </Switch>
      <div style={{display : allPath.includes(location.pathname) ? 'block' : 'none' }}>
        <ul className='nav'>
          <li><NavLink to='/index'>
          <i className="iconfont icon-shouye" /><br />
            首页</NavLink></li>
          <li><NavLink to='/fl'>
          <i className="iconfont icon-fenlei" /><br />
            分类</NavLink></li>
          <li><NavLink to='/car'>
          <i className="iconfont icon-gouwuche" /><br />
            购物车</NavLink></li>
          <li><NavLink to='/home'>
          <i className="iconfont icon-wode" /><br />
            个人中心</NavLink></li>
        </ul>
      </div>
      
      
      
    </div>
  );
}

export default App;
